<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="shortcut icon" href="./common/images/favicon.png">

    <title>群发消息</title>
  

    <!-- Bootstrap core CSS -->
    <link href="js/bootstrap/dist/css/bootstrap.css" rel="stylesheet" />
    <link rel="stylesheet" href="./assets/fonts/font-awesome-4/css/font-awesome.min.css">
    <link href="./js/icheck/skins/all.css" rel="stylesheet">
    <link href="./assets/css/style.css" rel="stylesheet" />

    <style type="text/css">
        .btnDiv
        {
            margin-right: 25px;
            float: left;
        }

        .btnDiv button
        {
            width: 90px; 
            border-radius: 5px;
            margin: 5px;
        }

        .tableDiv
        {
            padding: 20px 20px 50px 20px; 
            background-color: #d7d7d7; 
            width: 700px;
            text-align: center;
        }

        .tableDiv table
        {
            width: 400px;
        }

        .tableDiv table tr
        {
            background-color: #fff;
            text-align: center;
        }

        .tableDiv table th
        {
            text-align: center;
        }

        .infoItem
        {
            margin: 10px 0; 
            line-height: 34px;
        }

        .infoItem .desc
        {
            width: 80px; 
            font-size: 16px;
            color:#000;
            padding: 0;
        }

        .nextDiv
        {
            margin: 35px;

        }

        .nextDiv button
        {
            width: 90px; 
            border-radius: 5px;
            margin: 5px;
        }

        .msgDiv
        {
            float: left; 
            background-color: #d7d7d7;
        }

        .userDiv
        {
            float: left;
            display: none;
        }

        .selDiv
        {
            width: 100px;
            padding: 0;
        }

        .selDiv button
        {
            width: 90px; 
            border-radius: 5px;
        }

        @media (max-width: 768px)
        {
            .tableDiv
            {
                width: 100%;
            }

            .tableDiv table
            {
                width: 100%;
            }
        }

    </style>

</head>
<body>
    <!-- Fixed navbar -->
    <div id="head-nav" class="navbar navbar-default navbar-fixed-top">

    </div>

    <div id="cl-wrapper" class="fixed-menu">

        <div class="container-fluid" id="pcont">
                <div class="col-md-12" style="padding-right: 0;">
                    <div class="block-flat">
                        <div class="header">      
                            <div class="pull-left">
                                <p class="jb_underline">提现审核&#62;&#62;提现详情</p>
                            </div>                      
                            <div class="clearfix"></div>
                        </div>
                        <div class="content">
                            <div class="btnDiv">
                                <div>
                                    <button type="button" class="btn btn-default" onclick="myPower()">我的权限</button>
                                </div>
                                <div>
                                    <button type="button" class="btn btn-default" onclick="sendMsg()">群发消息</button>
                                </div>
                            </div>

                            <div class="msgDiv">
                                <div class="col-sm-12 infoItem">
                                    <div class="col-sm-3 desc">消息标题</div>
                                    <div class="col-sm-9 value">
                                        <input type="text" class="form-control" placeholder="">
                                    </div>
                                </div>
                                <div class="col-sm-12 infoItem">
                                    <div class="col-sm-3 desc">消息内容</div>
                                    <div class="col-sm-9 value">
                                        <textarea class="form-control" style="min-height: 120px;"></textarea>
                                    </div>
                                </div>

                                <div class="pull-right nextDiv">
                                    <button type="button" class="btn btn-default" onclick="gotoUser()">下一步</button>
                                </div>
                            </div>


                            <div class="userDiv">
                                <div class="row" >
                                    <div class="col-sm-12">
                                        <div class="pull-left" style="background-color: #ddd; margin: 10px 0; padding:10px 50px;">
                                            <div id="datatable-icons_length" class="dataTables_length col-sm-2" style="width: 150px;">
                                                <select size="1" class="form-control">
                                                    <option value="1">用户ID</option>
                                                    <option value="2" selected="selected">用户名</option>
                                                    <option value="3">状态</option>
                                                </select>
                                            </div>
                                            <div class="col-sm-2" style="width: 250px;">
                                                <input id="searchUserName" type="text" class="form-control" placeholder="关键词">
                                            </div>
                                            <div class="col-sm-2" style="width: 100px;">
                                                <button type="button" class="btn btn-jianbei">搜索</button>
                                            </div>

                                        </div>
                                        <div class="clearfix"></div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-sm-12">
                                        <div class="pull-left" style="margin: 10px 0; padding:10px 0;">
                                            <div class="col-sm-2 selDiv">
                                                <button type="button" class="btn btn-default">全选本页</button>
                                            </div>
                                            <div class="col-sm-2 selDiv">
                                                <button type="button" class="btn btn-default">无</button>
                                            </div>
                                            <div class="col-sm-2 selDiv">
                                                <button type="button" class="btn btn-default">全选全部</button>
                                            </div>
                                        </div>

                                        <div class="pull-right" style="margin: 10px 0; padding:10px 0;">
                                            <div class="col-sm-2 selDiv">
                                                <button type="button" class="btn btn-default">群发消息</button>
                                            </div>
                                        </div>
                                        <div class="clearfix"></div>
                                    </div>
                                </div>

                                <table class="table table-bordered" id="datatable-icons" >
                                    <thead style="background-color: #ffd866;">
                                        <tr>
                                            <th>选择</th>
                                            <th>用户ID</th>
                                            <th>用户名</th>
                                            <th>等级</th>
                                            <th>状态</th>
                                            <th>身份</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr class="odd gradeX">
                                            <td>
                                                <label class="radio-inline">
                                                    <input type="checkbox" value="5" name="rad1" class="icheck" >
                                                </label>
                                            </td>
                                            <td>000831</td>
                                            <td>贝粉000831</td>
                                            <td>3</td>
                                            <td style="color:#06b55a;">正常</td>
                                            <td>学生</td>
                                        </tr>
                                        <tr class="odd gradeX">
                                            <td>
                                                <label class="radio-inline">
                                                    <input type="checkbox" value="5" name="rad1" class="icheck" >
                                                </label>
                                            </td>
                                            <td>000831</td>
                                            <td>贝粉000831</td>
                                            <td>3</td>
                                            <td style="color:red;">封禁</td>
                                            <td>学生</td>
                                        </tr>
                                        <tr class="odd gradeX">
                                            <td>
                                                <label class="radio-inline">
                                                    <input type="checkbox" value="5" name="rad1" class="icheck" >
                                                </label>
                                            </td>
                                            <td>000831</td>
                                            <td>贝粉000831</td>
                                            <td>3</td>
                                            <td style="color:#06b55a;">正常</td>
                                            <td>学生</td>
                                        </tr>
                                        <tr class="odd gradeX">
                                            <td>
                                                <label class="radio-inline">
                                                    <input type="checkbox" value="5" name="rad1" class="icheck" >
                                                </label>
                                            </td>
                                            <td>000831</td>
                                            <td>贝粉000831</td>
                                            <td>3</td>
                                            <td style="color:red;">封禁</td>
                                            <td>学生</td>
                                        </tr>

                                    </tbody>
                                </table>

                                <div class="row">
                                    <div class="col-sm-12">
                                        <div class="pull-right">
                                            <p style="margin: 18px 0 18px 50px;">
                                                <span>
                                                    共
                                                    <span style="color:orange;">39</span>
                                                    个记录,共
                                                    <span style="color:orange;">7</span>
                                                    页,跳到
                                                </span>
                                                <input type="number" name="" style="width: 50px;">
                                                <span>页</span>
                                                <button>确定</button>
                                            </p>
                                        </div>
                                        <div class="pull-right">
                                            <div class="dataTables_paginate paging_bs_normal">
                                                <ul class="pagination">
                                                    <li class="disabled"><a href="#">&laquo; 上一页</a></li>
                                                    <li class="active"><a href="#">1</a></li>
                                                    <li><a href="#">2</a></li>
                                                    <li><a href="#">3</a></li>
                                                    <li><a href="#">4</a></li>
                                                    <li><a href="#">5</a></li>
                                                    <li><a href="#">下一页 &raquo;</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>                          

                            <div class="clearfix"></div>
                        </div>
                    </div>              
                </div>
        </div>
    </div>

  <script type="text/javascript" src="js/jquery.js"></script>
  <script src="js/bootstrap/dist/js/bootstrap.min.js"></script>
  <script type="text/javascript" src="./js/icheck/icheck.min.js"></script>

  <script type="text/javascript">
        var headerUrl = "./header.html"
        $("#head-nav").load(headerUrl,function(response,status,xhr){

        });

        if(jQuery().iCheck){
            $('.icheck').iCheck({
              checkboxClass: 'icheckbox_square-green checkbox',
              radioClass: 'icheckbox_square-green',
            });
        }

        function sendMsg() {
            // body...
            window.location.href='./sendMsg.html';
        }

        function myPower() {
            // body...
            window.location.href='./myPower.html';
        }

        function gotoUser() {
            // body...
            document.querySelector(".msgDiv").style.display = "none";
            document.querySelector(".userDiv").style.display = "block";
        }
  </script>

  </body>

</html>
